<template>
	<view class="system_tutorial_container">
		<view class="system_tutorial_box">
			<view class="system_tutorial_all" v-for="(item, index) in tutorialList" :key="index"
				@click="handleCheckDetail(item)">
				<view class="">
					<view class="system_tutorial_title">
						{{item.module}}
					</view>
					<view class="system_tutorial_date">
						创建时间：{{item.created_at}}
					</view>
				</view>

				<view class="">
					<u-icon name="arrow-right" color="#777" size="26"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageObj: {
					pageNow: 1,
					pageSize: 10
				},
				total: 0,
				tutorialList: []
			}
		},
		onLoad() {
			if (this.pageObj.pageNow == this.total) {
				return
			} else {
				this.getSystemInstructionsList()
			}

		},
		onReachBottom() {
			if (this.pageObj.pageNow < this.total) {
				this.pageObj.pageNow++
				this.getSystemInstructionsList()
			} else if (this.pageObj.pageNow == this.total) {
				uni.showToast({
					title: '暂无更多数据',
					icon: 'none'
				})
				return
			}
		},
		methods: {
			// 获取系统教程接口
			getSystemInstructionsList() {
				this.$request('/api/getSystemInstructionsList', {
					page_now: this.pageObj.pageNow,
					page_size: this.pageObj.pageSize
				}, 'GET').then(res => {
					if (res.code == 1) {
						res.data.forEach(item => {
							this.tutorialList.push(item)
						})
						this.total = res.page_info.page_count
					} else {
						uni.showToast({
							title: '获取系统教程失败',
							icon: 'none'
						})
						return
					}
				})
			},

			// 查看详情
			handleCheckDetail(val) {
				uni.navigateTo({
					url: '/pages/agentPortion/my/systemTutorialDetail/systemTutorialDetail?id=' + val.id
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.system_tutorial_container {
		padding: 30rpx 20rpx;

		.system_tutorial_box {
			background: #FFFFFF;
			border-radius: 10rpx;

			.system_tutorial_all {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 20rpx;

				.system_tutorial_title {
					font-family: Source Han Sans SC;
					font-weight: 400;
					font-size: 32rpx;
					color: #333333;
				}

				.system_tutorial_date {
					font-family: Source Han Sans CN;
					font-weight: 300;
					font-size: 26rpx;
					color: #808080;
					padding-top: 20rpx;
				}
			}
		}
	}
</style>